<template>
  <div id="app">
  	 <v-heady :seller="seller" ></v-heady>
     <div class="tab border-bottom">
     	 <div class="tab-item"><router-link to="/goods">商品</router-link></div>
     	 <div class="tab-item"><router-link to="/ratings">评论</router-link></div>
     	 <div class="tab-item"><router-link to="/seller">商家</router-link></div>
     </div>
     <div class="content"></div>
     <keep-alive exclude="deta">
         <router-view :seller="seller" ></router-view>
     </keep-alive>
  </div>
</template>

<script>
import heady from '@/components/header/header';
//import {urlParse} from 'common/js/util';
import axios from 'axios'
export default {
  name: 'App',
  data(){
	  return{
		seller:{
//		     id:(()=>{
////		     	  let queryParam=ur
//		     })()
	  	}
	  }
  },
  components: {
   'v-heady':heady
  },
  created() {
	   this.getgomeinfo()
   },
   methods:{
		getgomeinfo(){
			axios.get('../../static/data.json')
			.then(this.gethomrinfosuc)
		},
		gethomrinfosuc(res){
			res=res.data;
//			console.log(res)
			if(res.seller&&res){
				this.seller=res.seller;
//				console.log(this.seller)
        //给对象直接赋值
//      this.seller=Object.assign({},this.seller,res.data)
		  }
    }


   }
}


</script>

<style lang="less"  scoped>
		@import "./common/stylus/border.css";
		#app{
			.tab{
				display:flex;
			 	width:100%;
			 	height:40px;
				line-height:40px;
					.tab-item{
						flex: 1;
						text-align:center;
						height:40px;
						&>a{
							display: block;
							text-align: center;
							font-size: 14px;
							color: rgb(77,85,93);
							&.active{
								color: rgb(240,20,20);
						 	}
						}
						
					}	
		  }	  
		}		
</style>


<!--<style>
	 d{text-align: center; display: flex; flex: 1; color: red; }
</style> -->

<!--<style lang="stylus" rel="stylesheet/stylus">
		#app
			.tab
				display:flex
			 	width:100%
			 	height:40px
			 	line-height:40px
				.tab-item
					text-align center
						height:40px
					
					
</style>-->
